﻿@model IEnumerable<Clirelmgt.Models.MetaFormField>

@{
    ViewBag.Title = "ListPage";
    Layout = "~/Views/Shared/_AdminLayout.cshtml";
}
<style>
    header, section {
        display: block;
    }

    body {
        font-family: Arial;
    }

    h1, h2 {
        text-align: center;
        font-weight: normal;
    }

    #features {
        margin: auto;
        width: 0px;
        font-size: 0.9em;
    }

    .connected, .sortable, .exclude, .handles {
        margin: auto;
        padding: 0;
        width: 310px;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        padding: 20px;
    }

        .sortable.grid {
            overflow: hidden;
        }

        .connected li, .sortable li, .exclude li, .handles li {
            list-style: none;
            border: 1px solid #CCC;
            background: #F6F6F6;
            font-family: "Tahoma";
            font-weight: bold;
            color: #1C94C4;
            margin: 5px;
            padding: 5px;
            height: 22px;
        }

        .handles span {
            cursor: move;
        }

    li.disabled {
        opacity: 0.5;
    }

    .sortable.grid li {
        line-height: 80px;
        float: left;
        width: 80px;
        height: 80px;
        text-align: center;
    }

    li.highlight {
        background: #1C94C4;
        color: white;
    }

    #connected {
        width: 440px;
        overflow: hidden;
        margin: auto;
    }

    .connected {
        float: left;
        width: 200px;
    }

        .connected.no2 {
            float: right;
        }

    li.sortable-placeholder {
        border: 1px dashed #CCC;
        background: none;
    }
</style>

<script>
    function GetListFields() {
        debugger;
        var fieldList = document.getElementById('listpagefields');
        var uldata = document.getElementById('fflist');
        for (var i = 0; i < uldata.children.length; i++) {
            fieldList.value += uldata.children[i].id + ';';
        }
    }
</script>
<div class="dashboard-wrapper">
    <div class="left-sidebar">
        <div class="row-fluid">
            <div class="span12">
                <div class="widget">
                    <div class="widget-header">
                        <div class="title">
                            Design List Page
                        </div>
                    </div>
                    <form method="post">
                        <table style="margin: 20px;">
                            <tr>
                                <td style="text-align: center;">
                                    <span style="font-size: 14px; font-weight: bold;">Table Fields</span>
                                </td>
                                <td style="width: 20px;"></td>
                                <td style="text-align: center;">
                                    <span style="font-size: 14px; font-weight: bold;">List Page Fields</span>
                                </td>
                            </tr>
                            <tr>
                                <td style="vertical-align: top;">
                                    <ul class="connected list no2">
                                        @if(TempData["TableFields"] !=null)
                                        {
                                            List<Clirelmgt.Models.MetaTableField> tableFields = TempData["TableFields"] as List<Clirelmgt.Models.MetaTableField>;
                                            foreach (var item in tableFields)
                                            {
                                                if(item.Name !="No" && item.Name!="Description")
                                                {
                                                <li id="@item.Name" class="highlight">@item.Labels.Where(obj=>(obj.LangID == "en-US")).ToList()[0].LabelText</li>
                                                }
                                            }
                                        }
                                    </ul>
                                </td>
                                <td></td>
                                <td style="vertical-align: top;">
                                    <ul id="fflist" class="connected list">
                                        @foreach (var item in Model)
                                        {
                                            <li id="@item.Name">@item.DisplayLabel</li>
                                        }
                                        
                                        <li id="Description">Name</li>
                                    </ul>
                                </td>
                            </tr>
                        </table>
                        <div class="form-actions no-margin">
                            <input type="hidden" value="" id="listpagefields" name="listpagefields" />
                            <button type="submit" class="btn btn-info pull-right" style="margin-left: 10px;" id="Btn_SaveCompile" name="Btn_SaveCompile" onclick="GetListFields(); return true;">
                                Compile & Save
                            </button>
                            <button type="submit" class="btn btn-info pull-right" id="Btn_Save" name="Btn_Save">
                                Save
                            </button>

                            <div class="clearfix">
                            </div>

                        </div>
                    </form>
                </div>
            </div>
        </div>

    </div>
    <div class="right-sidebar">
    </div>
</div>

